<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    
<!DOCTYPE html>
  <base href="${APP_PATH}/">
<html lang="zh">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
<title>教学管理员考试表</title>
<link rel="icon" href="favicon.ico" type="image/ico">
<meta name="keywords" content="LightYear,光年,后台模板,后台管理系统,光年HTML模板">
<meta name="description" content="LightYear是一个基于Bootstrap v3.3.7的后台管理系统的HTML模板。">
<meta name="author" content="yinqi">
<link href="public/css/bootstrap.min.css" rel="stylesheet">
<link href="public/css/materialdesignicons.min.css" rel="stylesheet">
<link href="public/css/style.min.css" rel="stylesheet">
<!--时间选择插件-->
<link rel="stylesheet" href="public/js/bootstrap-datetimepicker/bootstrap-datetimepicker.min.css">
<!--日期选择插件-->
<link rel="stylesheet" href="public/js/bootstrap-datepicker/bootstrap-datepicker3.min.css">

</head>
  
<body>
<div class="lyear-layout-web">
  <div class="lyear-layout-container">
    <!--左侧导航-->
     <jsp:include page="/menu.jsp"></jsp:include>
    <!--End 左侧导航-->
    
    <!--头部信息-->
     <jsp:include page="/head.jsp"></jsp:include>
    <!--End 头部信息-->
    
    <!--页面主要内容-->
    <main class="lyear-layout-content">
      
      <div class="container-fluid">
        
        <div class="row">
          <div class="col-lg-12">
            <div class="card">
              <div class="card-toolbar clearfix">
              
              
                <form class="pull-right search-bar" method="get" action="#!" role="form">

                  <!--                     日期条件 -->
                 <div class="input-daterange input-group js-datepicker" data-auto-close="false" data-date-format="yyyy-mm-dd">
                  <input class="form-control" type="text" id="daterange1" name="daterange1" placeholder="从">
                  <span class="input-group-addon"><i class="mdi mdi-chevron-right"></i></span>
                  <input class="form-control" type="text" id="daterange2" name="daterange2" placeholder="至">
                </div>
<!--                     日期条件 -->  
                
                  <div class="input-group">
                    <div class="input-group-btn">
                      <input type="hidden" name="search_field" id="search-field" value="title">
                      <button class="btn btn-default dropdown-toggle" id="search-btn" data-toggle="dropdown" type="button" aria-haspopup="true" aria-expanded="false">
                      标题 <span class="caret"></span>
                      </button>
                      <ul class="dropdown-menu">
                        <li> <a tabindex="-1" href="javascript:void(0)" data-field="title">考试名</a> </li>
                      
                      </ul>
                    </div>
                    <input type="text" class="form-control" value="" name="keyword" placeholder="请输入查询考试名">       
                       <div class="input-group-btn">
                     <button class='btn btn-s btn-default' type="button"  onclick="searchBy()"  title='查询' data-toggle='tooltip'><i class='mdi mdi-search-web'></i></button>
                  </div>       
                  </div>
                </form>
                
                
                
                
                <div class="toolbar-btn-action">
                        <button type="button" class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-lg"><i class="mdi mdi-plus"></i>新增</button>
                  <a class="btn btn-success m-r-5" href="#!"><i class="mdi mdi-check"></i> 启用</a>
                  <a class="btn btn-warning m-r-5" href="#!"><i class="mdi mdi-block-helper"></i> 禁用</a>
                  <a class="btn btn-danger" href="#!"><i class="mdi mdi-window-close"></i> 删除</a>
                </div>
              </div>
              <div class="card-body">
                
                <div class="table-responsive">
                  <table class="table table-bordered">
                    <thead>
                      <tr>
                        <th>
                          <label class="lyear-checkbox checkbox-primary">
                            <input type="checkbox" id="check-all"><span></span>
                          </label>
                        </th>
                        <th>编号</th>
                        <th>考试名</th>
                        <th>开始时间</th>
                        <th>结束时间</th>
                        <th>班级名</th>
                        <th>考试教室</th>
                        
                        <th>操作</th>
                       
                      </tr>
                    </thead>
                    <tbody id="tbody">

                      
                    </tbody>
                  </table>
                </div>
                <ul class="pagination">
                  <li class="disabled"><span>«</span></li>
                  <li class="active"><span>1</span></li>
                  <li><a href="#1">2</a></li>
                  <li><a href="#1">3</a></li>
                  <li><a href="#1">4</a></li>
                  <li><a href="#1">5</a></li>
 
                  <li class="disabled"><span>...</span></li>
                  <li><a href="#!">8</a></li>
               
                  <li><a href="#!">»</a></li>
                </ul>
       
              </div>
            </div>
          </div>
          
          
          
          
          
          
          <!--              编辑模态框 -->
<div class="modal fade" id="edit">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header  bg-info" >
						<h3>考试信息修改</h3>
					</div>
					<form class="form-horizontal"  id="editForm" method="post" >
					<div class="modal-body">
						
							<input type="hidden" name="eid" id="eidE"value="">
                            	<div class="input-group col-md-push-3">
                            	<br>
								<label for="score">考试名&nbsp;&nbsp;&nbsp;</label>
								<input type="text" id="nameE" name="name" /><br><br>			
                                </div>	
                                
                                <div class="input-group col-md-push-3">
                            	<br>
								<label for="score">班级id&nbsp;&nbsp;&nbsp;</label>
								<input type="text" id="classidE" name="classid" /><br><br>			
                                </div>	
                                
                                 <div class="input-group col-md-push-3">
                            	<br>
								<label for="score">教室id&nbsp;&nbsp;&nbsp;</label>
								<input type="text" id="roomidE" name="roomid" /><br><br>			
                                </div>	
                                
                                    <div class="input-group col-md-push-3">
                            	<br>
								<label for="score">开始时间：&nbsp;&nbsp;&nbsp;</label>
								  <input class="form-control js-datetimepicker" type="text" name="starttime" id="starttimeE" placeholder="请选择具体时间" value="" data-side-by-side="true" data-locale="zh-cn" data-format="YYYY-MM-DD HH:mm" /><br><br>			
                                </div>
                                
                                    <div class="input-group col-md-push-3">
                            	<br>
								<label for="score">开始时间：&nbsp;&nbsp;&nbsp;</label>
								  <input class="form-control js-datetimepicker" type="text"  name="endtime" id="endtimeE" placeholder="请选择具体时间" value="" data-side-by-side="true" data-locale="zh-cn" data-format="YYYY-MM-DD HH:mm" /><br><br>			
                                </div>
  
                                
					</div>
					 <div class="modal-footer">
					 <button type="button" class="btn btn-s btn-primary " onclick="edit()" id="update">提交</button>
					     <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					 </div>
					</form>
				</div>
			</div>
		</div>

<!--              编辑模态框 -->
          
          
          
          <!-- 新增模态框 -->
                  <div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
                  <div class="modal-dialog modal-lg" role="document">
                    <div class="modal-content">
                      <div class="modal-header  bg-info">
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                        <h4 class="modal-title " id="myLargeModalLabel">新增考试信息</h4>
                      </div>
                       <form action="" method="post" id="addScore">
                      <div class="modal-body">
                       
                        <div class="input-group col-md-push-4">
                        	<label for="score">考试名：&nbsp;&nbsp;&nbsp;</label>
                         <input type="text" name="name" id="name"/><br>
                        </div>
                        <div class="input-group col-md-push-4">
                        	<label for="courseid">班级id：&nbsp;&nbsp;&nbsp;</label>
                         <input type="text" name="classid" id="classid"/><br>
                        </div>
                        <div class="input-group col-md-push-4">
                        	<label for="examid">教室id：&nbsp;&nbsp;&nbsp;</label>
                         <input type="text" name="roomid" id="roomid"/><br>
                        </div>
                        <div class="input-group col-md-push-4">
                        	<label for="score">开始时间：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>
                           <input class="form-control js-datetimepicker" type="text" id="starttime" name="starttime" placeholder="请选择具体时间" value="" data-side-by-side="true" data-locale="zh-cn" data-format="YYYY-MM-DD HH:mm" /><br>
                        </div>
                        <div class="input-group col-md-push-4">
                        	<label for="score">结束时间：&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</label>
                           <input class="form-control js-datetimepicker" type="text" id="endtime" name="endtime" placeholder="请选择具体时间" value="" data-side-by-side="true" data-locale="zh-cn" data-format="YYYY-MM-DD HH:mm" /><br>
                        </div>
 
                      
                      </div>
                      <div class="modal-footer">
                        <button type="button" id="addSubmit" onclick="addExam()" class="btn btn-primary">点击保存</button>
                        <button type="button" class="btn btn-default"  data-dismiss="modal">关闭</button> 
                      </div>
                        </form>
                    </div>
                  </div>
                </div>
       <!-- 新增模态框 -->      
          
          
          
          
          
          
        </div>
        
      </div>
      
    </main>
    <!--End 页面主要内容-->
  </div>
</div>

<script type="text/javascript" src="public/js/jquery.min.js"></script>
<script type="text/javascript" src="public/js/bootstrap.min.js"></script>
<script type="text/javascript" src="public/js/perfect-scrollbar.min.js"></script>
<script type="text/javascript" src="public/js/main.min.js"></script>

<script type="text/javascript" src="public/js/moment.js"></script>

<!--时间选择插件-->
<script src="public/js/bootstrap-datetimepicker/moment.min.js"></script>
<script src="public/js/bootstrap-datetimepicker/bootstrap-datetimepicker.min.js"></script>
<script src="public/js/bootstrap-datetimepicker/locale/zh-cn.js"></script>
<!--日期选择插件-->
<script src="public/js/bootstrap-datepicker/bootstrap-datepicker.min.js"></script>
<script src="public/js/bootstrap-datepicker/locales/bootstrap-datepicker.zh-CN.min.js"></script>

<script type="text/javascript">
$(function(){
    
    
   
    $.ajax({
		url:"${APP_PATH}/exam/teachermanager/indexDo",
		type:"post",
		success:function(data){
			
			show(data)
			
		}
	})
	
	   $('.search-bar .dropdown-menu a').click(function() {
	         var field = $(this).data('field') || '';
	         $('#search-field').val(field);
	         $('#search-btn').html($(this).text() + ' <span class="caret"></span>');
	     });
    
    $("#edit").on("show.bs.modal",function(e){
   	 var t=$(e.relatedTarget).data("eid");
   	 var t3=$(e.relatedTarget).data("classid");
  	 var t5=$(e.relatedTarget).data("roomid");
   	 var t7=$(e.relatedTarget).data("starttime");
     var t9=$(e.relatedTarget).data("endtime");
     var t11=$(e.relatedTarget).data("name");
   	 
     var t2 = String(t);
   	 var t4=String(t3);
   	 var t6=String(t5);
   	 var t8=String(t7);
   	 var t10=String(t9);
   	 var t12=String(t11);
   	
//    	 alert("eid:  "+t2);
//    	 alert("classid :  "+t4); 
//      alert("roomid:  "+t6);
//   	 alert("starttime :  "+t8);
//   	 alert("endtime :  "+t10);
//   	 alert("name :  "+t12);
  	 
   	 
   	 
   	 $("#eidE").val(t2);
   	 $("#nameE").val(t12);
   	 $("#classidE").val(t4);
	 $("#roomidE").val(t6);
   	 $("#starttimeE").val(t8);
	 $("#endtimeE").val(t10);



    })
    
		
  
});

//show************************************************************************/
function show(data){

	var content="";
	var count=1;
	$.each(data.examList,function(index,obj){
		content+="<tr><th><label class='lyear-checkbox checkbox-primary'><input type='checkbox' name='sid' value="+obj.sid+"><span></span></label></th>"
		content+="<th>"+ count++ +"</th>";
		content+="<th>"+obj.name+"</th>";
		content+="<th>"+obj.starttime+"</th>";
		content+="<th>"+obj.endtime+"</th>";
		
		$.each(data.classList,function(index,obj2){
			if(obj.classid==obj2.cid){
			content+="<th>"+obj2.cname+"</th>"
			}
			})
		$.each(data.roomList,function(index,obj3){
			if(obj.roomid==obj3.rid){
			content+="<th>"+obj3.rname+"</th>"
			}
			})
	
	
		
		content+=" <th><div class='btn-group'>"
		content+="<button class='btn   btn-s  btn-default ' data-toggle='modal' data-target='#edit' data-name="+obj.name+" data-eid="+obj.eid+" data-classid="+obj.classid+" data-roomid="+obj.roomid+"  data-starttime="+obj.starttime+"  data-endtime="+obj.endtime+" id="+obj.eid+"><i class='mdi mdi-pencil'></i>编辑</button>"
		content+="<button class='btn btn-s btn-default' onclick='deleteScore("+obj.eid+")' href='exam/delete' title='删除' data-toggle='tooltip'><i class='mdi mdi-delete-forever'></i>删除</button></div></th></tr>"
		
        
		
	})
	$("#tbody").html(content);	
}

//编辑************************************************************************/



function edit(){
	alert("123");
		$.ajax({
			url:"exam/editExam",
			type:"post",
			data:$("#editForm").serialize(),
			success:function(obj){
				alert("123");
					 window.location.reload();
	}
		});
	
}
/************************************************************************/

//新增************************************************************************/



function addExam(){
	alert("321");
		$.ajax({
			url:"exam/addExam",
			type:"post",
			data:$("#addScore").serialize(),
			success:function(obj){
				alert("123");
					 window.location.reload();
	}
		});
	
}
/************************************************************************/


//删除byId************************************************************************/
function deleteScore(sid){
	var flag=confirm("确认删除？");
	if(flag){
		$.ajax({
			url:"exam/deleteScore",
			type:"post",
			data:{"eid":eid},
			dataType:"json",
			success:function(obj){

					 window.location.reload();
	}
		});
	}
}
/************************************************************************/
//搜索by ******************************************************************/



function searchBy(){
	

	var choise=$("#search-btn").text().trim();
	var daterange1=$("#daterange1").val();
	var daterange2=$("#daterange2").val();
	var name=$("#keyword").val();	
	searchAjax(name,daterange1,daterange2)
}

function searchAjax(name,daterange1,daterange2){
	
	$.ajax({
		
		url:"${APP_PATH}/exam/searchBy",
		type:"post",
		data:{
			"name":name,
			"daterange1":daterange1,
			"daterange2":daterange2
			
		},
		
		success:function(data){
			show(data);
			
		
		}
	})

}
/************************************************************************/



</script>
</body>
</html>